<!--
 * @Author: your name
 * @Date: 2021-04-19 13:40:06
 * @LastEditTime: 2021-07-21 14:22:03
 * @LastEditors: Please set LastEditors
 * @Description: 转交Modal
 * @FilePath: \dolphin-data-center-front-end\src\pages\owns\orderList.vue
-->
<template>
  <a-modal :visible="transferModal" title="转交" @ok="handleOk" @cancel="handleCancel" destroy-on-close :afterClose="onDestroy">
    <a-form-model ref="transfer" :model="transferState" :rules="transferRules" :label-col="{ span: 4 }" :wrapper-col="{ span: 18 }">
      <a-form-model-item label="转交人员" prop="name">
        <a-select show-search :filter-option="false" :value="transferState.name" placeholder="请选择人员" @search="onSearchUser" @change="onChangeUser">
          <a-select-option v-for="item in memberList" :key="item.realName + ',' + item.id"> {{ item.realName }} ----- {{ item.postName }} </a-select-option>
        </a-select>
      </a-form-model-item>
    </a-form-model>
  </a-modal>
</template>

<script>
import { getSearchUser } from "@/services/project";
export default {
  name: "transferModal",
  props: {
    transferModal: {
      type: Boolean,
      default: false,
    },
  },
  data () {
    return {
      memberList: [],
      userId: "",
      transferState: { name: undefined },
      transferRules: {
        name: [{ required: true, message: "请选择人员！", trigger: "change" }],
      },
    };
  },
  methods: {
    handleCancel () {
      this.$refs.transfer.resetFields();
      this.$emit("cancelModal", {
        modal: "转交",
        str: "cancel",
        data: ""
      });
    },
    handleOk () {
      this.$refs.transfer.validate((valid) => {
        if (valid) {
          this.$emit("cancelModal", {
            modal: "转交",
            str: "ok",
            data: this.userId
          });
        } else {
          return false;
        }
      });
    },
    onDestroy () {
      this.$refs.transfer.resetFields();
    },
    onSearchUser (value) {
      if (value.length >= 2) {
        this.getSearchUser({ realName: value });
      }
    },
    onChangeUser (value) {
      const arr = value.split(",");
      this.transferState.name = arr[0];
      this.userId = arr[1];
    },
    /**
     * @description: 搜索系统人员
     * @param {*}
     * @return {*}
     */
    getSearchUser (params) {
      getSearchUser(params).then((res) => {
        let { code, data, msg } = res.data;
        if (code == 200) {
          this.memberList = data;
        } else {
          this.$message.error(msg);
        }
      });
    },
  },
};
</script>

<style>
</style>